<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">

	<style>
		textarea {
			width: 100%;
		}

		textarea:empty {
			display: none;
		}
	</style>
</head>

<body>

	<fieldset>
		<legend>发送文本</legend>
		<form method="POST" action="/s">
			<div><textarea name="text"></textarea></div>
			<button type="submit">发送</button>
		</form>
	</fieldset>

	<fieldset>
		<legend>发送文件</legend>
		<form method="POST" action="/s" enctype="multipart/form-data">
			<input type="file" name="file"><button type="submit">发送</button>
		</form>
	</fieldset>

	<fieldset>
		<legend>接收文本</legend>
		<textarea id="text"></textarea>
		<button id="get">接收</button>
		<button id="copy">复制</button>
	</fieldset>

	<fieldset>
		<legend>接收文件</legend>
		<form>
			<div><input></div>
			<button type="submit">下载</button>
		</form>
	</fieldset>

	<script>
		document.getElementById('get').onclick = function () {
			fetch('/r').then(function (response) {
				return response.text();
			}).then(function (text) {
				document.getElementById('text').value = text;
			});
		}

		document.getElementById('copy').onclick = function () {
			document.getElementById('text').select();
			if (document.execCommand('Copy')) {
				alert('复制成功');
			}
		}
	</script>

</body>

</html>